﻿Ext.require([
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.util.*',
    'Ext.state.*'
]);



Ext.onReady(function() {
    Ext.QuickTips.init();
Ext.Ajax.request({
url: 'jsp/dycolumn-list.jsp',
params: 'method=自己的方法',
method: 'POST',
success: function(rs,request){
var result = rs.responseText;//拿到结果集，此时为字符串
var json = Ext.JSON.decode(result);//将字符串转换为json类型
var cm =  //Ext.JSON.decode("[{'dataIndex':'COL2','header':'学号','width':'100'},{'dataIndex':'COL3','header':'学号','width':'100'}]");
json.columModle;//new Ext.grid.ColumnModel(json.columModle);
var ds = new Ext.data.JsonStore({
data:json.data,
fields:json.fieldsNames
});
    

    
    
    Ext.create('Ext.data.Store', {
    storeId:'employeeStore',
    fields:['firstname', 'lastname', 'senority', 'dep', 'hired'],
    data:[
        {firstname:"Michael", lastname:"Scott", senority:7, dep:"Manangement", hired:"01/10/2004"},
        {firstname:"Dwight", lastname:"Schrute", senority:2, dep:"Sales", hired:"04/01/2004"},
        {firstname:"Jim", lastname:"Halpert", senority:3, dep:"Sales", hired:"02/22/2006"},
        {firstname:"Kevin", lastname:"Malone", senority:4, dep:"Accounting", hired:"06/10/2007"},
        {firstname:"Angela", lastname:"Martin", senority:5, dep:"Accounting", hired:"10/21/2008"}
    ]
});

Ext.create('Ext.grid.Panel', {
    title: 'Column Demo',
    store: ds,//Ext.data.StoreManager.lookup('employeeStore'),
    columns: cm,
    /*[
        {text: 'First Name',  dataIndex:'firstname'},
        {text: 'Last Name',  dataIndex:'lastname'},
        {text: 'Hired Month',  dataIndex:'hired', xtype:'datecolumn', format:'M'},
        {id:'0',dataIndex:'COL2',editor:'true',header:'学号',tooltip:'aaaa',width:'100'}
        {text: 'Department (Yrs)', xtype:'templatecolumn', tpl:'{dep} ({senority})'}
    ],*/
    width: 800,
    forceFit: true,
    renderTo: Ext.getBody()
});
},
failure: function(rs,request){
}
});



});



/*

//3.根据json创建grid 
Ext.onReady(function() {

    Ext.QuickTips.init();


Ext.Ajax.request({
url: 'jsp/dycolumn-list.jsp',
params: 'method=自己的方法',
method: 'POST',
success: function(rs,request){
var result = rs.responseText;//拿到结果集，此时为字符串
var json = Ext.util.JSON.decode(result);//将字符串转换为json类型
var cm = new Ext.grid.ColumnModel(json.columModle);
var ds = new Ext.data.JsonStore({
data:json.data,
fields:json.fieldsNames
});
           
var grid = new Ext.grid.GridPanel({
region: 'center',
split: true,
border:false,
cm:cm,
ds:ds
});

// grid.render(document.body);
    var viewport = new Ext.Viewport({
        layout: 'border',
        items: [{
            region: 'north',
            contentEl: 'head'
        }, grid, {
            region: 'south',
            contentEl: 'foot'
        }]
    });
},
failure: function(rs,request){
}
});

});*/

/*注意的地方：首先grid必须在sucsess方法里实例，否则会报错，json数据也只在sucess方法里起作用。Ext的灵魂就是json很多控件都可以用以上方法实现。 */

